<!DOCTYPE html>
<html lang="en">

	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta charset="utf-8" />
		<title>发展综合分析</title>

		<meta name="description" content="" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

		<!-- bootstrap & fontawesome -->
		<link rel="stylesheet" href="/assets/css/bootstrap.min.css" />
		<link rel="stylesheet" href="/assets/font-awesome/4.5.0/css/font-awesome.min.css" />

		<!-- page specific plugin styles -->
		<link rel="stylesheet" href="/assets/css/jquery-ui.min.css" />

		<!-- text fonts -->
		<link rel="stylesheet" href="/assets/css/fonts.googleapis.com.css" />

		<!-- ace styles -->
		<link rel="stylesheet" href="/assets/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />

		<!--[if lte IE 9]>
			<link rel="stylesheet" href="/assets/css/ace-part2.min.css" class="ace-main-stylesheet" />
		<![endif]-->
		<link rel="stylesheet" href="/assets/css/ace-skins.min.css" />
		<link rel="stylesheet" href="/assets/css/ace-rtl.min.css" />

		<!--[if lte IE 9]>
		  <link rel="stylesheet" href="/assets/css/ace-ie.min.css" />
		<![endif]-->

		<!-- inline styles related to this page -->

		<!-- ace settings handler -->
		<script src="/assets/js/ace-extra.min.js"></script>

		<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

		<!--[if lte IE 8]>
		<script src="/assets/js/html5shiv.min.js"></script>
		<script src="/assets/js/respond.min.js"></script>
		<![endif]-->
	</head>

	<body class="no-skin">
		<div id="navbar" class="navbar navbar-default          ace-save-state">
			<div class="navbar-container ace-save-state" id="navbar-container">
				<button type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler" data-target="#sidebar">
					<span class="sr-only">Toggle sidebar</span>

					<span class="icon-bar"></span>

					<span class="icon-bar"></span>

					<span class="icon-bar"></span>
				</button>

				<div class="navbar-header pull-left">
					<a href="/views/index.html" class="navbar-brand">
						<small>
							<i class="fa fa-leaf"></i>
							学生发展数据综合评价与分析系统
						</small>
					</a>
				</div>

				<div class="navbar-buttons navbar-header pull-right" role="navigation">
					<ul class="nav ace-nav">

						<li class="light-blue dropdown-modal">
							<a data-toggle="dropdown" href="#" class="dropdown-toggle">

								<img class="nav-user-photo us_photo" src="/assets/images/avatars/blank.jpg" alt="个人头像" style="background-color:#fff" />

								<span class="user-info">
							       <span id="us_name"></span>
								</span>

								<i class="ace-icon fa fa-caret-down"></i>
							</a>

							<ul class="user-menu dropdown-menu-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
								<li>
									<a id="setting" target="_blank">
										<i class="ace-icon fa fa-cog"></i> 设置
									</a>
								</li>

								<li>
									<a id="profile" target="_blank">
										<i class="ace-icon fa fa-user"></i> 个人信息
									</a>
								</li>

								<li class="divider"></li>

								<li>
									<a href="/login.html" onclick="logout()">
										<i class="ace-icon fa fa-power-off"></i> 注销
									</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>
			</div>
			<!-- /.navbar-container -->
		</div>

		<div class="main-container ace-save-state" id="main-container">
			<script type="text/javascript">
				try {
					ace.settings.loadState('main-container')
				} catch(e) {}
			</script>

			<div id="sidebar" class="sidebar                  responsive                    ace-save-state">
				<script type="text/javascript">
					try {
						ace.settings.loadState('sidebar')
					} catch(e) {}
				</script>

				<div class="sidebar-shortcuts" id="sidebar-shortcuts">
					<div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
						<button class="btn btn-success">
							<i class="ace-icon fa fa-signal"></i>
						</button>

						<button class="btn btn-info">
							<i class="ace-icon fa fa-pencil"></i>
						</button>

						<button class="btn btn-warning">
							<i class="ace-icon fa fa-users"></i>
						</button>

						<button class="btn btn-danger">
							<i class="ace-icon fa fa-cogs"></i>
						</button>
					</div>

					<div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
						<span class="btn btn-success"></span>

						<span class="btn btn-info"></span>

						<span class="btn btn-warning"></span>

						<span class="btn btn-danger"></span>
					</div>
				</div>
				<!-- /.sidebar-shortcuts -->

				<ul class="nav nav-list">
					<li class="active">
						<a href="/views/index.html">
							<i class="menu-icon fa fa-tachometer"></i>
							<span class="menu-text"> 我的首页 </span>
						</a>

						<b class="arrow"></b>
					</li>

				</ul>
				<!-- /.nav-list -->

				<div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
					<i id="sidebar-toggle-icon" class="ace-icon fa fa-angle-double-left ace-save-state" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
				</div>
			</div>

			<div class="main-content">
				<div class="main-content-inner">
					<div class="breadcrumbs ace-save-state" id="breadcrumbs">
						<ul class="breadcrumb">
							<li>
								<i class="ace-icon fa fa-home home-icon"></i>
								<a href="/views/index.html">首页</a>
							</li>

							<li class="active">发展综合分析</li>
						</ul>
						<!-- /.breadcrumb -->

					</div>

					<div class="page-content">

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->
								<div class="row">
									<div class="col-sm-12">
										<h3 class="header blue lighter smaller">
											<i class="ace-icon fa fa-spinner"></i>
											发展综合分析
										</h3>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-2">
										<a href="" onclick="return false"><span class="glyphicon glyphicon-star" style="margin-right: 3px;"></span></a>
										<font size="4" id="st_id"></font>
									</div>
									<div class="col-sm-2">
										<a href="" onclick="return false"><span class="glyphicon glyphicon-user" style="margin-right: 3px;"></span></a>
										<font size="4" id="st_name"></font>
									</div>
									<div class="col-sm-2">
										<a href="" onclick="return false"><span class="glyphicon glyphicon-stats" style="margin-right: 3px;"></span></a>
										<font size="4" id="st_grade"></font>
									</div>
									<div class="col-sm-3">
										<a href="" onclick="return false"><span class="glyphicon glyphicon-education" style="margin-right: 3px;"></span></a>
										<font size="4" id="st_major"></font>
									</div>
									<div class="col-sm-2">
										<a href="" onclick="return false"><span class="glyphicon glyphicon-home" style="margin-right: 3px;"></span></a>
										<font size="4" id="st_class"></font>
									</div>

								</div>

								<div class="row">
									<div class="col-sm-12">
										<h3 class="header blue lighter smaller">
										</h3>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-6">

										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
													成绩变化图
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding">
													<div id="main" style="height: 380px;margin-top: 25px;"></div>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->
									</div>
									<div class="col-sm-6">

										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
													学分积欠图
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding">
													<!-- 个人学分积欠变化趋势图 -->
													<div id="ch_lack_credit" style="height:380px;margin-top: 25px;"></div>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->
									</div>

								</div>

								<div class="row">
									<div class="col-sm-10">
										<div class="hr hr24 hr-dotted"></div>
									</div>
								</div>

								<div class="row">
									<div class="col-sm-6">

										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
												成绩分布图
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding">
													<!--成绩分布图-->
													<div id="st_grade_distribute" style="height:380px;margin-top: 25px;margin-left: 30px;"></div>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->
									</div>

									<!--个人获奖-->
									<div class="col-sm-6">
										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
													个人获奖情况
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body" style="padding-right: 50px;">
												<div class="widget-main no-padding">
													<table class="table table-bordered table-striped table-hover" style="margin-top: 25px;margin-left: 30px;" id="st_award">
														<thead class="thin-border-bottom" style="visibility: hidden;" id="st_award_title">
															<tr>
																<th>
																	<i class="ace-icon fa fa-caret-right blue"></i>
																	<font size="3">获奖日期</font>
																</th>
																<th>
																	<i class="ace-icon fa fa-caret-right blue"></i>
																	<font size="3">奖项名称</font>
																</th>
															</tr>
														</thead>
														<tbody id="st_award_tbody"></tbody>
													</table>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->
									</div>
								</div>

								<div class="row">
									<div class="col-sm-10">
										<div class="hr hr24 hr-dotted"></div>
									</div>
								</div>

								<div class="row">

									<!--雷达图-->
									<div class="col-sm-6">

										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
													综合素质
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding">
													<center>
														<div id="st_radar" style="width:450px;height: 380px;margin-left: 20px;margin-top: 25px;"></div>
													</center>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->
									</div>

									<!--服务精神-->
									<div class="col-sm-6">

										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
													服务精神
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding" style="margin-bottom: 30px;">
													<table class="table table-bordered table-striped table-hover" style="margin-top: 25px;margin-left: 30px;" id="st_vol">
														<thead class="thin-border-bottom" style="visibility: hidden;" id="st_vol_title">
															<tr>
																<th>
																	<i class="ace-icon fa fa-caret-right blue"></i>
																	<font size="3">总志愿时长</font>
																</th>

															</tr>
														</thead>
														<tbody id="st_vol_tbody"></tbody>
													</table>
												</div>

												<div class="widget-main no-padding" style="margin-bottom: 30px;">
													<table class="table table-bordered table-striped table-hover" style="margin-top: 25px;margin-left: 30px;" id="st_vol_rank">
														<thead class="thin-border-bottom" style="visibility: hidden;" id="st_vol_rank_title">
															<tr>
																<th>
																	<i class="ace-icon fa fa-caret-right blue"></i>
																	<font size="3">志愿时长排名</font>
																</th>

															</tr>
														</thead>
													</table>
												</div>

												<div class="row" style="display: flex;margin-bottom: 30px;">
													<div style="flex: 1;">
														<center>

															<div id="data_class" class="easy-pie-chart percentage" data-percent="0" data-color="#D15B47">
																<span class="percent" id="sp_class"></span>
															</div>
														</center>
													</div>
													<div style="flex: 1;">
														<center>
															<div id="data_grade" class="easy-pie-chart percentage" data-percent="0" data-color="#34CEEB">
																<span class="percent" id="sp_grade"></span>
															</div>
														</center>
													</div>

													<div style="flex: 1;">
														<center>
															<div id="data_academy" class="easy-pie-chart percentage" data-percent="0" data-color="#87B87F">
																<span class="percent" id="sp_academy"></span>
															</div>
														</center>
													</div>

												</div>

												<div class="widget-main no-padding">
													<table class="table table-bordered table-striped table-hover" style="margin-left: 30px;" id="st_duty">
														<thead class="thin-border-bottom" style="visibility: hidden;" id="st_duty_title">
															<tr>
																<th>
																	<i class="ace-icon fa fa-caret-right blue"></i>
																	<font size="3">担任时间</font>
																</th>
																<th>
																	<i class="ace-icon fa fa-caret-right blue"></i>
																	<font size="3">担任职务</font>
																</th>
															</tr>
														</thead>
														<tbody id="st_duty_tbody"></tbody>
													</table>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->
									</div>

								</div>
								<!-- /.row -->
								<div class="row">
									<div class="col-sm-10">
										<div class="hr hr24 hr-dotted"></div>
									</div>
								</div>
								<!--个人发展建议-->
								<div class="row">
									<div class="col-sm-6">

										<div class="widget-box transparent">
											<div class="widget-header widget-header-flat">
												<h4 class="widget-title lighter">
													<i class="ace-icon fa fa-star orange"></i>
													个人发展建议
												</h4>

												<div class="widget-toolbar">
													<a href="#" data-action="collapse">
														<i class="ace-icon fa fa-chevron-up"></i>
													</a>
												</div>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding">

													<div class="tabbable">
														<ul class="nav nav-tabs padding-12 tab-color-blue background-blue" id="myTab4">
															<li class="active">
																<a data-toggle="tab" href="#study">学习成绩建议</a>
															</li>

															<li>
																<a data-toggle="tab" href="#sport">身体素质建议</a>
															</li>

															<li>
																<a data-toggle="tab" href="#sciense">科研情况建议</a>
															</li>
															<li>
																<a data-toggle="tab" href="#volunteer">志愿服务建议</a>
															</li>
														</ul>

														<div class="tab-content">
															<div id="study" class="tab-pane in active">
																<p style="font-size: 17px;color: black;text-indent: 2em;" id="p_study"></p>
															</div>

															<div id="sport" class="tab-pane">
																<p style="font-size: 17px;color: black;text-indent: 2em;" id="p_sport"></p>
															</div>

															<div id="sciense" class="tab-pane">
																<p style="font-size: 17px;color: black;text-indent: 2em;" id="p_sciense"></p>
															</div>
															<div id="volunteer" class="tab-pane">
																<p style="font-size: 17px;color: black;text-indent: 2em;" id="p_volunteer"></p>
															</div>
														</div>
													</div>
												</div>
												<!-- /.widget-main -->
											</div>
											<!-- /.widget-body -->
										</div>
										<!-- /.widget-box -->

									</div>
									<!-- /.col -->
								</div>
							</div>

							<!-- ECharts单文件引入 -->
							<!-- 标签式单文件引入 -->
							<script src="/assets/js/echarts-all.js"></script>
							<script src="/assets/js/jquery-2.1.4.min.js"></script>

							<!-- PAGE CONTENT ENDS -->

						</div>
						<!-- /.row -->
					</div>
					<!-- /.page-content -->
				</div>
			</div>
			<!-- /.main-content -->

			<div class="footer">
				<div class="footer-inner">
					<div class="footer-content">
						<span class="bigger-120">
							<span class="blue bolder" style="margin-right: 10px;">学生发展数据综合评价与分析系统</span> 苏州科技大学 &copy; 2018-2019
						</span>

					</div>
				</div>
			</div>

			<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
				<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
			</a>
		</div>
		<!-- /.main-container -->

		<!-- basic scripts -->

		<!--[if !IE]> -->
		<script src="/assets/js/jquery-2.1.4.min.js"></script>
		<script src="/assets/js/jquery.form.js"></script>
		<script src="/assets/js/jquery.cookie.js"></script>
		<script src="/assets/js/sddb.util.js"></script>

		<script src="/assets/js/jquery.easypiechart.min.js"></script>

		<!-- <![endif]-->

		<!--[if IE]>
<script src="/assets/js/jquery-1.11.3.min.js"></script>
<![endif]-->
		<script type="text/javascript">
			if('ontouchstart' in document.documentElement) document.write("<script src='/assets/js/jquery.mobile.custom.min.js'>" + "<" + "/script>");
		</script>
		<script src="/assets/js/bootstrap.min.js"></script>

		<!-- page specific plugin scripts -->
		<script src="/assets/js/jquery-ui.min.js"></script>
		<script src="/assets/js/jquery.ui.touch-punch.min.js"></script>

		<!-- ace scripts -->
		<script src="/assets/js/ace-elements.min.js"></script>
		<script src="/assets/js/ace.min.js"></script>

		<!-- inline scripts related to this page -->

		<!--由学号获取学生的基本信息-->
		<script>
			$(function() {
				//首先查看本用户是否有权限查看个人详细
				$.ajax({
					type: "post",
					url: "/user/getAllowDetail",
					dataType: "json",
					data: {
						"from": $.cookie("us_id"),
						"to": window.location.href.split("=")[1]
					},
					success: function(data) {
						if(data.success) {
							$.ajax({
								type: "post",
								url: "/student/findStuById",
								dataType: "json",
								data: {
									"st_id": window.location.href.split("=")[1]
								},

								success: function(data) {
									//alert(JSON.stringify(data));
									$("#st_id").html("学号:" + data.st_id);
									$("#st_name").html("姓名:" + data.st_name);
									$("#st_grade").html("年级:" + data.st_grade);
									$("#st_major").html("专业:" + data.st_major);
									$("#st_class").html("班级:" + data.st_class);

									var st_name = data.st_name;

									getGpa(st_name);
									getCredit();
									getDistribution(st_name);
									getAward();
									getRadar(st_name);
									getVolunteer();
									getDuty();

								},
								error: function(err) {
									alert("获取学生信息发生错误！");
								}

							});

						} else {
							alert("您没有权限查看该生的详细信息!");
							window.close();
						}
					}
				});

			});
		</script>

		<!--个人成绩变化趋势表-->
		<script type="text/javascript">
			function getGpa(st_name) {
				// 基于准备好的dom，初始化echarts图表
				var myChart = echarts.init(document.getElementById('main'));

				var option = {
					title: {
						text: '成绩变化情况',
						textStyle: {
							color: 'black',
							fontFamily: 'Microsoft YaHei'
						},
						subtextStyle: {
							color: 'black',
							fontFamily: 'Microsoft YaHei'
						},
					},
					tooltip: {
						trigger: 'axis'
					},
					legend: {
						data: [st_name]
					},
					toolbox: {
						show: true,
						feature: {
							mark: {
								show: true
							},
							dataView: {
								show: true,
								readOnly: false
							},
							magicType: {
								show: true,
								type: ['line', 'bar']
							},
							restore: {
								show: true
							},
							saveAsImage: {
								show: true
							}
						}
					},
					calculable: true,
					xAxis: [{
						type: 'category',
						boundaryGap: false,
						//data : ['大一上','大一下','大二上','大二下','大三上','大三下','大四上','大四下']
					}],
					yAxis: [{
						type: 'value',
						axisLabel: {
							formatter: '{value}'
						}
					}],
					series: [{
						name: st_name,
						type: 'line',
						//data:[3.2, 3.2, 3.8, 4.0, 3.7, 3.3, 3.7,3.2],
						barWidth: 80,
						itemStyle: {
							normal: {
								label: {
									show: true,
									position: 'top',
									textStyle: {
										color: 'black',
										fontSize: 16
									}

								}
							}
						}

					}]
				};

				//ajax请求数据

				$.ajax({
					type: "post",
					url: "/score/gpa.do",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},

					success: function(data) {
						var xaxis = [];
						var gpa = [];
						for(var i = 0; i < data.length; i++) {
							xaxis.push(data[i].year);
							gpa.push(data[i].value);

						}

						// 为echarts对象加载数据 
						option.xAxis[0].data = xaxis;
						option.series[0].data = gpa;
						myChart.setOption(option, true);
					},
					error: function(err) {
						alert("发生错误");
					}

				});

				//图表大小自适应
				window.addEventListener("resize", function() {
					myChart.resize();
				});

			}
		</script>

		<!--个人学分积欠变化趋势表-->
		<script type="text/javascript">
			function getCredit() {
				// 基于准备好的dom，初始化echarts图表
				var myChart2 = echarts.init(document.getElementById('ch_lack_credit'));

				var option2 = {
					title: {
						text: '必修课学分获得与积欠情况',
						textStyle: {
							color: 'black',
							fontFamily: 'Microsoft YaHei'
						},
						subtextStyle: {
							color: 'black',
							fontFamily: 'Microsoft YaHei',
							fontSize: 14
						},
						itemGap: 12

					},
					tooltip: {
						trigger: 'axis'
					},
					legend: {
						data: ['已获学分', '积欠学分']
					},
					toolbox: {
						show: true,
						feature: {
							mark: {
								show: true
							},
							dataView: {
								show: true,
								readOnly: false
							},
							magicType: {
								show: true,
								type: ['line', 'bar', 'stack', 'tiled']
							},
							restore: {
								show: true
							},
							saveAsImage: {
								show: true
							}
						}
					},
					calculable: true,
					xAxis: [{
						type: 'category',
						//data: ['2015-2016', '2016-2017', '2017-2018', '2018-2019']
					}],
					yAxis: [{
						type: 'value'
					}],
					series: [{
							name: '已获学分',
							type: 'bar',
							barWidth: 80,
							barGap: 30,
							itemStyle: {
								normal: {
									label: {
										show: true,
										position: 'top',
										textStyle: {
											color: 'black',
											fontSize: 16
										}
									}

								}
							}
							//data: [22, 18, 10, 32],

						},
						{
							name: '积欠学分',
							type: 'bar',
							barWidth: 80,
							barGap: 30,
							itemStyle: {
								normal: {
									label: {
										show: true,
										position: 'top',
										textStyle: {
											color: 'black',
											fontSize: 16
										}
									}

								}
							}
							//data: [10, 5, 12, 2],

						}
					]
				};

				//ajax请求数据
				$.ajax({
					type: "post",
					url: "/score/credit.do",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},

					success: function(res) {
						var xaxis = [];
						var y1 = [];
						var y2 = [];
						for(var i = 0; i < res.yearCredits.length; i++) {
							xaxis.push(res.yearCredits[i].year);
							y1.push(res.yearCredits[i].credit_gain);
							y2.push(res.yearCredits[i].credit_ungain);

						}

						// 为echarts对象加载数据 
						option2.xAxis[0].data = xaxis;
						option2.series[0].data = y1;
						option2.series[1].data = y2;
						option2.title.subtext = '学分获得率:' + res.rate + "%";
						myChart2.setOption(option2, true);
					},
					error: function(err) {
						myChart2.clear();
						alert("发生错误");
					}

				});

				//图表大小自适应
				window.addEventListener("resize", function() {
					myChart2.resize();
				});

			}
		</script>

		<!--成绩分布图-->
		<script>
			function getDistribution(st_name) {
				var myChart = echarts.init(document.getElementById('st_grade_distribute'));

				var option1 = {
					title: {
						text: '必修课成绩分布状况',
						x: 'center'
					},
					tooltip: {
						trigger: 'item',
						formatter: "{a} <br/>{b} : {c} ({d}%)"
					},
					legend: {
						orient: 'vertical',
						x: 'left',
						data: ["优秀", "良好", "中等", "及格", "不及格"],
						textStyle: { //图例文字的样式
							fontSize: 14
						}
					},
					color: ['#65d186', '#f67287', '#f29e3c', '#c05bdd', '#7a65f2'],
					toolbox: {
						show: true,
						feature: {
							mark: {
								show: true
							},
							dataView: {
								show: true,
								readOnly: false
							},
							magicType: {
								show: true,
								type: ['pie', 'funnel'],
								option: {
									funnel: {
										x: '25%',
										width: '50%',
										funnelAlign: 'left',
										max: 50
									}
								}
							},
							restore: {
								show: true
							},
							saveAsImage: {
								show: true
							}
						}
					},
					calculable: true,
					series: [{
						name: '成绩分布',
						type: 'pie',
						radius: '55%',
						center: ['50%', '60%'],
						itemStyle: {
							normal: {
								label: {
									show: true,
									textStyle: {
										fontSize: 15
									},
									formatter: '{b}:{c}: ({d}%)'
								}
							}
						},
						data: [{
								name: "优秀",
								value: 0
							}, {
								name: "良好",
								value: 0
							},
							{
								name: "中等",
								value: 0
							},
							{
								name: "及格",
								value: 0
							},
							{
								name: "不及格",
								value: 0
							},
						]
					}]
				};

				$.ajax({
					type: "post",
					url: "/score/getScoreDistribution",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},

					success: function(data1) {
						for(var i = 0; i < 5; i++) {
							option1.series[0].data[i].value = data1[option1.series[0].data[i].name];
						}
						myChart.setOption(option1);
					},
					error: function(err) {
						alert("获取成绩分布图失败...");
					}
				});

				//图表大小自适应
				window.addEventListener("resize", function() {
					myChart.resize();
				});
			}
		</script>

		<!--获取奖项数据 -->
		<script type="text/javascript">
			function getAward() {

				//ajax请求数据
				//清空之前的行
				$("#st_award tbody").html("");

				$.ajax({
					type: "post",
					url: "/data/cloud.do",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},

					success: function(data) {
						var table = document.getElementById("st_award");
						var t_body = document.getElementById("st_award_tbody");
						for(var i = 0; i < data.length; i++) {
							var t_tr = document.createElement("tr");
							var td_year = document.createElement("td");
							var td_award = document.createElement("td");

							td_year.innerHTML = "<font size='3' color='#000000'>" + data[i].year + "</font>";
							td_award.innerHTML = "<font size='3' color='#000000'>" + data[i].name + "</font>";

							t_tr.appendChild(td_year);
							t_tr.appendChild(td_award);
							t_body.appendChild(t_tr);
						}
						table.appendChild(t_body);

						document.getElementById("st_award_title").style.visibility = "visible";

					},
					error: function(err) {
						alert("发生错误");
					}

				});
			}
		</script>

		<!--雷达图-->
		<script type="text/javascript">
			function getRadar(st_name) {
				// 基于准备好的dom，初始化echarts图表
				var st_radar_chart = echarts.init(document.getElementById('st_radar'));

				var radar_option = {
					title: {
						text: '综合素质',
						subtext: ''
					},
					tooltip: {
						trigger: 'axis'
					},
					legend: {
						orient: 'vertical',
						x: 'right',
						y: 'bottom',
						data: [st_name]
					},
					toolbox: {
						show: true,
						feature: {
							mark: {
								show: true
							},
							dataView: {
								show: true,
								readOnly: false
							},
							restore: {
								show: true
							},
							saveAsImage: {
								show: true
							}
						}
					},
					polar: [{
						//										indicator: [{
						//												text: '文化素质',
						//												max: 100
						//											},
						//											{
						//												text: '身体素质',
						//												max: 100
						//											},
						//											{
						//												text: '科研情况',
						//												max: 100
						//											},
						//											{
						//												text: '志愿服务',
						//												max: 100
						//											},
						//											{
						//												text: '道德素质',
						//												max: 100
						//											},
						//											{
						//												text: '心理素质',
						//												max: 100
						//											},
						//											{
						//												text: '职业素质',
						//												max: 100
						//											}
						//										]
					}],
					calculable: true,
					series: [{
						name: '雷达图',
						type: 'radar',
						itemStyle: {
							normal: {
								label: {
									show: true,
									position: 'top',
									textStyle: {
										color: 'black',
										fontSize: 16
									}
								}
							}
						},
						data: [{
							//value: [67, 46, 72, 46, 49, 37, 67],
							//name: '同学A'
						}]
					}]
				};

				//ajax请求数据

				$.ajax({
					type: "post",
					url: "/radar/person.do",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},
					success: function(data) {
						var latitude = [];
						var radar_value = [];
						for(var i = 0; i < data.length; i++) {
							var temp = {
								text: data[i].radarName,
								max: 100
							};
							latitude.push(temp);
							radar_value.push(data[i].radarScore);
						}
						radar_option.polar[0].indicator = latitude;
						radar_option.series[0].data[0].value = radar_value;
						radar_option.series[0].data[0].name = st_name;

						// 为echarts对象加载数据 
						st_radar_chart.setOption(radar_option);

						//获取建议
						getAdvice(data[0].radarScore, data[1].radarScore, data[2].radarScore, data[3].radarScore);

					},
					error: function(err) {
						alert("发生错误！");
					}

				});

				//图表大小自适应
				window.addEventListener("resize", function() {
					st_radar_chart.resize();
				});
			}
		</script>

		<!--获取志愿时长与班级、年级、学院排名-->
		<script type="text/javascript">
			function getVolunteer() {
				//清空之前的行
				$("#st_vol tbody").html("");

				//将各项数据置为0
				$("#data_class").attr("data-percent", 0);
				$("#data_grade").attr("data-percent", 0);
				$("#data_academy").attr("data-percent", 0);
				$.ajax({
					type: "post",
					url: "/volunteer/getVolunteerRank",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},

					success: function(data) {
						//设置总志愿时长数据
						var table = document.getElementById("st_vol");
						var tbody = document.getElementById("st_vol_tbody");
						var tr = document.createElement("tr");
						var td = document.createElement("td");
						td.innerHTML = "<font size='3' color='#000000'>" + data.all_time + " 个小时" + "</font>";
						tr.appendChild(td);
						tbody.appendChild(tr);
						table.appendChild(tbody);
						document.getElementById("st_vol_title").style.visibility = "visible";

						//显示志愿时长排名标题
						document.getElementById("st_vol_rank_title").style.visibility = "visible";

						//设置排名数据
						$("#data_class").attr("data-percent", data.class_rank);
						$("#data_grade").attr("data-percent", data.grade_rank);
						$("#data_academy").attr("data-percent", data.academy_rank);
						$("#sp_class").text("班级前" + data.class_rank + "%");
						$("#sp_grade").text("年级前" + data.grade_rank + "%");
						$("#sp_academy").text("学院前" + data.academy_rank + "%");

						$('.easy-pie-chart.percentage').each(function() {
							$(this).easyPieChart({
								barColor: $(this).data('color'),
								trackColor: '#EEEEEE',
								scaleColor: false,
								lineCap: 'butt',
								lineWidth: 8,
								animate: ace.vars['old_ie'] ? false : 1000,
								size: 98
							}).css('color', $(this).data('color'));
						});

					},
					error: function(err) {
						alert("获取志愿数据出错...");
					}

				});
			}
		</script>

		<!--获取职务数据 -->
		<script type="text/javascript">
			function getDuty() {

				//ajax请求数据
				//清空之前的行
				$("#st_duty tbody").html("");

				$.ajax({
					type: "post",
					url: "/duty/getDuty",
					dataType: "json",
					data: {
						"id": window.location.href.split("=")[1]
					},

					success: function(data) {
						var table = document.getElementById("st_duty");
						var t_body = document.getElementById("st_duty_tbody");
						if(data.length == 0) {
							var t_tr = document.createElement("tr");
							var t_td = document.createElement("td");
							t_td.innerHTML = "<font size='3' color='#000000'>" + "近期未担任任何职务..." + "</font>";
							t_tr.appendChild(t_td);
							t_body.appendChild(t_tr);
						}
						for(var i = 0; i < data.length; i++) {
							var t_tr = document.createElement("tr");
							var td_year = document.createElement("td");
							var td_duty = document.createElement("td");

							td_year.innerHTML = "<font size='3' color='#000000'>" + data[i].du_time + "</font>";
							td_duty.innerHTML = "<font size='3' color='#000000'>" + data[i].du_name + "</font>";

							t_tr.appendChild(td_year);
							t_tr.appendChild(td_duty);
							t_body.appendChild(t_tr);
						}
						table.appendChild(t_body);

						document.getElementById("st_duty_title").style.visibility = "visible";

					},
					error: function(err) {
						alert("发生错误");
					}

				});
			}
		</script>

		<!-- 获取个人建议-->
		<script type="text/javascript">
			function getAdvice(study, sport, sciense, volunteer) {
				$.ajax({
					type: "post",
					url: "/radar/advice.do",
					dataType: "json",
					data: {
						"study": parseInt(study),
						"sport": parseInt(sport),
						"sciense": parseInt(sciense),
						"volunteer": parseInt(volunteer)
					},
					success: function(data) {
						$("#p_study").text(data[0].ad_suggestion);
						$("#p_sport").text(data[1].ad_suggestion);
						$("#p_sciense").text(data[2].ad_suggestion);
						$("#p_volunteer").text(data[3].ad_suggestion);

					},
					error: function(err) {
						alert("获取个人建议失败!");
					}
				});
			}
		</script>

	</body>

</html>